<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="inc/taglibs.jsp" %>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <%@ include file="inc/meta.jsp" %>
    <meta name="description" content="">
    <meta name="author" content="">
    <title>故障报修详情</title>
    <%@ include file="inc/css.jsp" %>
</head>
<body>

<div id="posts" class="wrapper">

    <%@ include file="inc/nav.jsp" %>

    <div id="page-wrapper">
        <div class="row">
            <div class="col-lg-12">
                <h1 class="page-header">故障报修管理</h1>
                <h4 style="margin-left: 10px;">——故障报修详情</h4>
            </div>
        </div>

        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <!-- /.panel-heading -->
                    <div class="panel-body">
                        <form class="form-horizontal">

                            <div class="form-group">
                                <label class="col-sm-2 control-label">编号:</label>

                                <div class="col-sm-4" style="padding-top: 5.5px;">
                                    ${malfunction.id}
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">提交平台:</label>

                                <div class="col-sm-4" style="padding-top: 5.5px;">
                                    <c:if test="${malfunction.type == 1}">APP端</c:if>
                                    <c:if test="${malfunction.type == 2}">微信端</c:if>
                                    （${malfunction.userName}）
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">联系方式:</label>

                                <div class="col-sm-4" style="padding-top: 5.5px;">
                                    ${malfunction.mobile}
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">地址:</label>

                                <div class="col-sm-4" style="padding-top: 5.5px;">
                                    ${malfunction.address}
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">提交时间:</label>

                                <div class="col-sm-4" style="padding-top: 5.5px;">
                                    ${malfunction.createTime}
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">状态:</label>

                                <div class="col-sm-4" style="padding-top: 5.5px;">
                                    <c:if test="${malfunction.status == 0}">待处理</c:if>
                                    <c:if test="${malfunction.status == 1}">处理中</c:if>
                                    <c:if test="${malfunction.status == 2}">已处理</c:if>
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">详情:</label>

                                <div class="col-sm-6" style="padding-top: 5.5px;">
                                    ${malfunction.description}
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">图片:</label>
                                <div class="col-sm-8" style="padding-top: 8px;">
                                    <div style="float: left;" id="lastImageDiv"></div>
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="col-sm-offset-2 col-sm-6" style="text-align: center">
                                    <a href="backend/malfunction/index" class="btn btn-primary" role="button">返回</a>
                                </div>
                            </div>
                        </form>
                    </div>
                    <!-- /.panel-body -->

                    <div id="tempDiv" style="display:none;float: left; height: 240px;width: 320px;margin-right:6px; z-index: 0;margin-bottom: 50px;">
                        <img class="imgs" alt="" src="" style="height: 240px;width: 320px; z-index: 1;"/>
                    </div>

                </div>
                <!-- /.panel -->
            </div>
        </div>


    </div>
    <!-- /#page-wrapper -->

</div>
<!-- /#wrapper -->

<%@ include file="inc/footer.jsp" %>
</body>
</html>
<script type="text/javascript">
    var _malfunction = {
        v: {
            id: "_malfunction",
            list: [],
            dTable: null
        },
        fn: {
            init: function () {
                // 加载故障报修图片数组
                _malfunction.fn.getSerImages();
            },
            getSerImages: function () {
                var imageList = ${imageList};

                $.each(imageList, function (i, item) {
                    if (null != item) {
                        _malfunction.fn.insertImage(item);
                    } else {
                        $('#lastImageDiv').html('暂无');
                    }
                });
            },
            insertImage: function (path) {
                var tempDiv = $("#tempDiv").clone();
                tempDiv.prop('id', '');
                tempDiv.css("display", "block");
                tempDiv.children(":first").prop("src", path);
                tempDiv.insertBefore("#lastImageDiv");
            }
        }
    }

    $(document).ready(function () {
        _malfunction.fn.init();
    });
</script>